<script setup>
import {onMounted, ref} from "vue";
import { http } from "@/api";
import { ElMessage } from "element-plus";
const formRef1 = ref(null)
const formData1 = ref({
  // 辐照度（W/m²）
  rated_power: '',
  // 温度（℃）
  temperature: '',
  // 收益（万元）
  income: '',
  // 日发的电量（kWh）
  day_power: '',
  // 月发的电量（万kWh）
  month_power: '',
  // 年发的电量（万kWh）
  year_power: '',
  // 安全运行（天）
  safe_day: '',
})
const rules1 = ref({
  rated_power: [
    { required: true, message: '请输入辐照度', trigger: 'blur' }
  ],
  temperature: [
    { required: true, message: '请输入温度', trigger: 'blur' }
  ],
  income: [
    { required: true, message: '请输入收益', trigger: 'blur' }
  ],
  day_power: [
    { required: true, message: '请输入日发的电量', trigger: 'blur' }
  ],
  month_power: [
    { required: true, message: '请输入月发的电量', trigger: 'blur' }
  ],
  year_power: [
    { required: true, message: '请输入年发的电量', trigger: 'blur' }
  ],
  safe_day: [
    { required: true, message: '请输入安全运行', trigger: 'blur' }
  ],
})
const submit1 = () => {
  formRef1.value.validate((valid) => {
    if (valid) {
      http.stationData.update(formData1.value).then(res => {
        ElMessage.success(res.msg)
      })
    } else {
      console.log('error submit!!')
      return false
    }
  })
}
const reset1 = () => {
  formRef1.value.resetFields()
}

onMounted(() => {
  http.stationData.list().then(res => {
    const obj = {}
    res.data.forEach(item => {
      obj[item.code] = item.value
    })
    for (const formData1Key in formData1.value) {
      if (formData1.value.hasOwnProperty(formData1Key)) {
        formData1.value[formData1Key] = obj[formData1Key]
      }
    }
  })
})
</script>

<template>
  <div class="data-container">
    <el-card shadow="never">
      <template #header>
        <div class="card-header">
          <span>场站数据</span>
        </div>
      </template>
      <el-form :model="formData1" :rules="rules1" ref="formRef1" label-position="top">
        <el-row :gutter="20">
          <el-col :span="8">
            <el-form-item label="辐照度（W/m²）" prop="rated_power">
              <el-input v-model="formData1.rated_power" placeholder="请输入辐照度"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="温度（℃）" prop="temperature">
              <el-input v-model="formData1.temperature" placeholder="请输入温度"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="收益（万元）" prop="income">
              <el-input v-model="formData1.income" placeholder="请输入收益"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="日发的电量（kWh）" prop="day_power">
              <el-input v-model="formData1.day_power" placeholder="请输入日发的电量"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="月发的电量（万kWh）" prop="month_power">
              <el-input v-model="formData1.month_power" placeholder="请输入月发的电量"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="年发的电量（万kWh）" prop="year_power">
              <el-input v-model="formData1.year_power" placeholder="请输入年发的电量"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="安全运行（天）" prop="safe_day">
              <el-input v-model="formData1.safe_day" placeholder="请输入安全运行"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item >
          <div style="text-align: center;width: 100%">

            <el-button type="primary" @click="submit1">提交</el-button>
          </div>
        </el-form-item>
      </el-form>

    </el-card>
  </div>
</template>

<style scoped lang="scss">

</style>